<admintpl file="header" />
<style>
    .btn {
        background-color:#red;
        padding:4px 12px;
        margin-left: 400px;
    }
    #goods_img img{max-widrh:100%; max-height:100%;}
    .ys{
        margin: 20px;
    }
    .a-upload {
        padding: 4px 10px;
        height: 20px;
        line-height: 20px;
        position: relative;
        cursor: pointer;
        color: #888;
        background: #fafafa;
        border: 1px solid #ddd;
        border-radius: 4px;
        overflow: hidden;
        display: inline-block;
        *display: inline;
        *zoom: 1
    }

    .a-upload  input {
        position: absolute;
        font-size: 100px;
        right: 0;
        top: 0;
        opacity: 0;
        filter: alpha(opacity=0);
        cursor: pointer
    }

    .a-upload:hover {
        color: #444;
        background: #eee;
        border-color: #ccc;
        text-decoration: none
    }
    a{cursor: pointer;}
    .fl{float:left;}
    .c-pages{padding:20px 0; text-align: center;}
    .c-pages.tl{text-align: left;}
    .c-pages span{display: inline-block; margin-right: 5px; font-size:12px; height:28px; line-height: 28px;}
    .c-pages span.col{color: #fe344e; font-weight: 600;}
    .c-pages span a{display: inline-block; margin:0 3px; height:28px; line-height: 28px; text-align: center; padding:0 12px; border:1px solid #ccc; text-decoration: none; border-radius: 2px;}
    .c-pages span a:link,.c-pages span a:active,.c-pages span a:visited{color: #333;}
    .c-pages span a:hover{ color: #157efb; border: 1px solid #157efb;}
    .c-pages span a.active{color: #fff; background: #157efb; border:1px solid #157efb;}
    .c-pages  .current{ color: #fff; background: #157efb; border: 1px solid #157efb; display: inline-block; margin: 0 3px; height: 28px;
        line-height: 28px;
        text-align: center;
        padding: 0 12px;
        text-decoration: none;
        border-radius: 2px;
    }
    .addWei{background: none; border:1px solid #ff8540; color: #ff8540; padding:4px 6px; font-size: 14px;float:right;margin-left:80px;margin-top:4px;}


    #photos{overflow:hidden;}
    #photos li{float:left; margin:5px;}
</style>
<body class="J_scroll_fixed">
<div class="wrap J_check_wrap">
    <ul class="nav nav-tabs">
        <li class="" ><a href="{:U('Lunbo/lunbotu_lst')}">轮播图列表</a></li>
        <li class="active" ><a>轮播图添加</a></li>
    </ul>
    <form action="{:U('Lunbo/lunbotu_add')}" method="post" class="form-horizontal js-ajax-forms" enctype="multipart/form-data" id="form">
        <div class="ys">
            链接内容
            <select id="lianjie" name="lianjie" style="width: 200px ;height: 35px;border: 2px solid #dee5ed">
                <option value="">请选择链接内容</option>
                <option value="1">个人信息</option>
                <option value="2">通告信息</option>
            </select>
        </div>

        <div class="ys">
           手&nbsp;&nbsp;机&nbsp;&nbsp;号
            <input type="number" id="phone" name="phone" value="" placeholder="手机号" style="width: 180px"/>
        </div>

        <div class="ys">
            轮播图片
            <input type="file" name="img" id="im">
            <div id="goods_img" style="width: 200px;height:150px;margin-left: 65px;margin-top: 20px;border: 1px solid grey"></div>
         </div>
        <div  class="ys" >
            <button class="btn btn-primary" type="button" value="2" onclick="sav()" style="margin-left: 200px;margin-top: 40px">保存</button>
        </div>
    </form>
</div>
</body>
</html>
<script src="public/js/laydate/laydate.js"></script>
<script type="text/javascript" src="__PUBLIC__/js/common.js"></script>
<script type="text/javascript" src="__PUBLIC__/umeditor1_2_2-utf8-php/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript" src="__PUBLIC__/js/layer/layer.js"></script>

<script type="text/javascript">

    function sav(){
        var lianjie=$("#lianjie").val();
        var phone = $("#phone").val();
        var img = $("#im").val();
       if(lianjie==""){
           alert("链接内容不能为空!");
           return false;
       }
        if(phone==""){
            alert("手机号不能为空!");
            return false;
        }
        if(!(/^1(3|4|5|7|8)\d{9}$/.test(phone))){
            alert("手机号码有误，请重填");
            return false;
        }
        if(img==""){
            alert("轮播图片不能为空!");
            return false;
        }


        $("#form").submit();
    }

    //商铺缩略图
    $(function() {
        $('#im').change(function(e) {
            var file = e.target.files[0];
            img(file);
        })
    })
    function img(file) {
        var img = new Image(), url = img.src = URL.createObjectURL(file);
        var $img = $(img);
        img.onload = function() {
            URL.revokeObjectURL(url);
            $('#goods_img').empty().append($img);
        }
    }



</script>